﻿<%@ Page Title="" Language="C#" MasterPageFile="~/SIPO.master" AutoEventWireup="true" CodeFile="rptDaftarRegistrasiDebitur.aspx.cs" Inherits="reports_Transaction_rptDaftarRegistrasiDebitur" %>

<asp:Content ID="Content1" ContentPlaceHolderID="body" Runat="Server">

    <script src="<%= ResolveUrl("~/scripts/jquery.validate.min.js") %>" type="text/javascript"></script>
<script src="<%= ResolveUrl("~/scripts/helper.js") %>" type="text/javascript"></script>
<script src="<%= ResolveUrl("~/scripts/jquery.validate.wrapper.js") %>" type="text/javascript"></script>
<link href="<%= ResolveUrl("~/styles/jquery.validate.error.css") %>" rel="stylesheet" type="text/css" />
<script src="<%= ResolveUrl("~/scripts/jquery-ui.min.js") %>" type="text/javascript"></script>

<%--<style type="text/css">
        .ui-autocomplete
        {
            max-height: 100px;
            overflow-y: auto; /* prevent horizontal scrollbar */
            overflow-x: hidden; /* add padding to account for vertical scrollbar */
            padding-right: 20px;
        }
        .custom-combobox
        {
            position: relative;
            display: inline-block;
        }
        .custom-combobox-toggle
        {
            position: absolute;
            top: 0;
            bottom: 0;
            margin-left: -1px;
            padding: 0; /* support: ie7 */
            height: 1.7em;
            top: 0.1em;
        }
        .custom-combobox-input
        {
            margin: 0;
            padding: 0.3em;
        }
        .style1
        {
            width: 225px;
        }
        .style2
        {
            width: 111px;
        }
    </style>

<script type="text/javascript" language="javascript">

    (function ($) {

        $.widget("custom.combobox", {
            _create: function () {
                this.wrapper = $("<span>")
          .addclass("custom-combobox")
          .insertafter(this.element);

                this.element.hide();
                this._createautocomplete();
                this._createshowallbutton();
            },

            _createautocomplete: function () {
                var selected = this.element.children(":selected"),
          value = selected.val() ? selected.text() : "";

                var width = this.element.width() > 100 ? "style='width:" + this.element.width() + "px';" : "";

                this.input = $("<input " + width + ">")
          .appendto(this.wrapper)
          .val(value)
          .attr("title", "")
          .addclass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left")
          .autocomplete({
              autofocus: true,
              selectfirst: true,
              delay: 0,
              minlength: 0,
              source: $.proxy(this, "_source")
          })
          .tooltip({
              tooltipclass: "ui-state-highlight"
          });

                this._on(this.input, {
                    autocompleteselect: function (event, ui) {
                        ui.item.option.selected = true;
                        this._trigger("select", event, {
                            item: ui.item.option
                        });

                        var idofcaller = this.element.attr('id');
                        switch (idofcaller.tolowercase()) {
                            case ("ddlsector"):
                                $('#ddlsector').change();
                                break;
                            case ("ddlsubsector"):
                                $('#ddlsubsector').change();
                                break;
                            case ("ddlsubsubsector"):
                                $('#ddlsubsubsector').change();
                            default:
                                break;
                        }

                    },

                    autocompletechange: "_removeifinvalid"
                });
            },

            _createshowallbutton: function () {
                var input = this.input,
          wasopen = false;

                $("<a>")
          .attr("tabindex", -1)
          .attr("title", "tamplikan semua item")
          .tooltip()
          .appendto(this.wrapper)
          .button({
              icons: {
                  primary: "ui-icon-triangle-1-s"
              },
              text: false
          })
          .removeclass("ui-corner-all")
          .addclass("custom-combobox-toggle ui-corner-right")
          .mousedown(function () {
              wasopen = input.autocomplete("widget").is(":visible");
          })
          .click(function () {
              input.focus();

              // close if already visible
              if (wasopen) {
                  return;
              }

              // pass empty string as value to search for, displaying all results
              input.autocomplete("search", "");
          });
            },

            _source: function (request, response) {
                var matcher = new regexp($.ui.autocomplete.escaperegex(request.term), "i");
                response(this.element.children("option").map(function () {
                    var text = $(this).text();
                    if (this.value && (!request.term || matcher.test(text)))
                        return {
                            label: text,
                            value: text,
                            option: this
                        };
                }));
            },

            _removeifinvalid: function (event, ui) {

                // selected an item, nothing to do
                if (ui.item) {
                    return;
                }

                // search for a match (case-insensitive)
                var value = this.input.val(),
          valuelowercase = value.tolowercase(),
          valid = false;
                this.element.children("option").each(function () {
                    if ($(this).text().tolowercase() === valuelowercase) {
                        this.selected = valid = true;
                        return false;
                    }
                });

                // found a match, nothing to do
                if (valid) {
                    return;
                }

                // remove invalid value
                this.input
          .val("")
          .attr("title", value + " tidak ditemukan")
          .tooltip("open");
                this.element.val("");
                this._delay(function () {
                    this.input.tooltip("close").attr("title", "");
                }, 2500);
                this.input.data("ui-autocomplete").term = "";
            },

            _destroy: function () {
                this.wrapper.remove();
                this.element.show();
            },
            autocomplete: function (value, text) {
                this.element.val(value);
                this.input.val(text);
            }
        });
    })(jquery);

    $(function () {

        $("#ddlsector").combobox();
        //$("#ddlregistrationemisiontype").combobox();
        $("#ddlsubsector").combobox();
        //$("#ddljenisemisi").combobox();
        $("#ddlsubsubsector").combobox();
       
    });

    </script>--%>

<script type="text/javascript">
    $(document).ready(function () {

        $("#<%= txtPeriodeAwal.ClientID %>").attr('disabled', 'disabled');
        $("#<%= txtPeriodeAkhir.ClientID %>").attr('disabled', 'disabled');
        $("#<%= txtTahun.ClientID %>").attr('disabled', 'disabled');
        $("#<%= ddlSektor.ClientID %>").attr('disabled', 'disabled');
        $("#<%= ddlSubSektor.ClientID %>").attr('disabled', 'disabled');
        $("#<%= ddlSubSubSektor.ClientID %>").attr('disabled', 'disabled');
        $("#<%= txtPeriodeAwal.ClientID %>").val('Periode Awal ');
        $("#<%= txtPeriodeAkhir.ClientID %>").val('Periode Akhir');
        //$("#<%= ddlSektor.ClientID %>").combobox('autocomplete', "", "-- pilih Sektor --'");
        //$("#<%= ddlSubSektor.ClientID %>").combobox('autocomplete', "", "-- pilih Sub Sektor --'");
        //$("#<%= ddlSubSubSektor.ClientID %>").combobox('autocomplete', "", "-- pilih Sub Sub Sektor --'");
        $("#<%= ddlSektor.ClientID %>").val('-- pilih Sektor --');
        $("#<%= ddlSubSektor.ClientID %>").val('-- pilih Sub Sektor --');
        $("#<%= ddlSubSubSektor.ClientID %>").val('-- pilih Sub Sub Sektor --');
        $('#txtddlSector').val('');
        $('#txtddlSubSector').val('');
        $('#txtddlSubSubector').val('');

        // format tanggal dengan datepicker
        $("#<%= txtPeriodeAwal.ClientID  %>").datepicker({ showWeek: true, showButtonPanel: true,
            changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy',
            numberOfMonths: 1,
            onSelect: function (selected) {
                $("#<%= txtPeriodeAkhir.ClientID %>").datepicker("option", "minDate", selected)
            }
        });

        $("#<%= txtPeriodeAkhir.ClientID  %>").datepicker({ showWeek: true, showButtonPanel: true,
            changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy',
            numberOfMonths: 1,
            onSelect: function (selected) {
                $("#<%= txtPeriodeAwal.ClientID %>").datepicker("option", "maxDate", selected)
            }
        });

        //format tahun harus angka
        $('#<%= txtTahun.ClientID %>').bind('keyup blur', function () {
            $(this).val($(this).val().replace(/[^0-9]/g, ''))
        });

        //radio button periode awal dan periode akhir
        $("#<%= rbPeriode1.ClientID %>").click(function () {
            $("#<%= txtPeriodeAwal.ClientID %>").removeAttr('disabled');
            $("#<%= txtPeriodeAkhir.ClientID %>").removeAttr('disabled');
            $("#<%= txtTahun.ClientID %>").attr('disabled', 'disabled');
        });

        $("#<%= rbTahun.ClientID %>").click(function () {
            $("#<%= txtPeriodeAwal.ClientID %>").attr('disabled', 'disabled');
            $("#<%= txtPeriodeAkhir.ClientID %>").attr('disabled', 'disabled');
            $("#<%= txtTahun.ClientID %>").removeAttr('disabled');
            $("#<%= txtPeriodeAwal.ClientID %>").val('Periode Awal ');
            $("#<%= txtPeriodeAkhir.ClientID %>").val('Periode Akhir');
        });

        $("#<%= rbPeriode2.ClientID %>").click(function () {
            $("#<%= txtPeriodeAwal.ClientID %>").attr('disabled', 'disabled');
            $("#<%= txtPeriodeAkhir.ClientID %>").attr('disabled', 'disabled');
            $("#<%= txtTahun.ClientID %>").attr('disabled', 'disabled');
            $("#<%= txtPeriodeAwal.ClientID %>").val('');
            $("#<%= txtPeriodeAkhir.ClientID %>").val('');
            $("#<%= txtPeriodeAwal.ClientID %>").val('Periode Awal ');
            $("#<%= txtPeriodeAkhir.ClientID %>").val('Periode Akhir');
        });


        //radio button sektor
        $("#<%= rbSektor1.ClientID %>").click(function () {
            $("#<%= ddlSektor.ClientID %>").removeAttr('disabled');
        });

        $("#<%= rbSektor2.ClientID %>").click(function () {
            $("#<%= ddlSektor.ClientID %>").attr('disabled', 'disabled');
            $("#<%= ddlSektor.ClientID %>").val('-- pilih jenis sektor --');
        });

        //radio button sub sektor
        $("#<%= rbSubSektor1.ClientID %>").click(function () {
            $("#<%= ddlSubSektor.ClientID %>").removeAttr('disabled');
        });

        $("#<%= rbSubSektor2.ClientID %>").click(function () {
            $("#<%= ddlSubSektor.ClientID %>").attr('disabled', 'disabled');
            $("#<%= ddlSubSektor.ClientID %>").val('-- pilih jenis sub sektor --');
        });

        //radio button sub sub sektor
        $("#<%= rbSubSubSektor1.ClientID %>").click(function () {
            $("#<%= ddlSubSubSektor.ClientID %>").removeAttr('disabled');
        });

        $("#<%= rbSubSubSektor2.ClientID %>").click(function () {
            $("#<%= ddlSubSubSektor.ClientID %>").attr('disabled', 'disabled');
            $("#<%= ddlSubSubSektor.ClientID %>").val('-- pilih jenis sub sub --');
        });



        function GetSector() {
            $sectors = $('#ddlSektor');
            var handlerUrlSector = '<%= ResolveUrl("~/AjaxHandler/Loaddata/getsector.ashx") %>';
            $.ajax({
                type: 'POST',
                url: handlerUrlSector,
                contentType: 'application/json',
                dataType: 'json',
                success: function (datas) {
                    $sectors.get(0).options.length = 0;
                    $sectors.get(0).options[0] = new Option("-- pilih sector --", "");
                    $.each(datas, function (i, data) {
                        $sectors.append('<option value="' + data.SectorID + '">' + data.SectorCode + '-' + data.SectorName + '</option>');
                    });
                },
                error: function () {
                    alert('Error!');
                }
            });
        };

        $("#<%= ddlSektor.ClientID %>").change(function () {
            //$('#ddlSubSector').combobox('autocomplete', "", "-- pilih sub sektor --");
            //$('#ddlSubSubSector').combobox('autocomplete', "", "-- pilih sub sub sektor --");
            //$('#ddlRegistrationEmisionType').combobox('autocomplete', "", "-- pilih registrasi emisi --");
            //$('#ddlJenisEmisi').combobox('autocomplete', "", "-- pilih jenis emisi --");
            
            //$("#<%= ddlSektor.ClientID %>").val('-- pilih Sektor --');
            //$("#<%= ddlSubSektor.ClientID %>").val('-- pilih Sub Sektor --');
            //$("#<%= ddlSubSubSektor.ClientID %>").val('-- pilih Sub Sub Sektor --');

            var sectorId = $("#<%= ddlSektor.ClientID %>").val();
            //$("#<%= ddlSektor.ClientID %>").val(sectorId);
            //$("#<%= ddlSubSektor.ClientID %>").val('');
            //$("#<%= ddlSubSubSektor.ClientID %>").val('');

            $subSectors = $("#<%= ddlSubSektor.ClientID %>");
            $subSubSectors = $("#<%= ddlSubSubSektor.ClientID %>");

            //alert(sectorId);
            if (sectorId > 0) {
                var handlerUrl = '<%= ResolveUrl("~/AjaxHandler/Loaddata/getsubsector.ashx?method=registrasi&sector_id=") %>';

                $.ajax({
                    type: 'POST',
                    url: handlerUrl + sectorId,
                    contentType: 'application/json',
                    dataType: 'json',
                    success: function (datas) {
                        $subSectors.get(0).options.length = 0;
                        $subSectors.get(0).options[0] = new Option("-- Pilih Sub Sektor --", "");
                        $subSubSectors.get(0).options.length = 0;
                        $subSubSectors.get(0).options[0] = new Option("-- Pilih Sub Sub Sektor --", "");
                        $.each(datas, function (i, data) {
                            $subSectors.append('<option value="' + data.SubSectorID + '">' + data.SubSectorCode + '-' + data.SubSectorName + '</option>');
                        });

                        $subSectors.bind("change", function () {
                            GetSubSubSector($(this).val());
                        });
                    },
                    error: function () {
                        alert('Error!');
                    }
                });
            }
            else {
                $subSectors.get(0).options.length = 0;
                $subSectors.get(0).options[0] = new Option("-- Pilih Sub Sektor --", "");
                $subSubSectors.get(0).options.length = 0;
                $subSubSectors.get(0).options[0] = new Option("-- Pilih Sub Sub Sektor --", "");
            }
            //GetTarifBySubSubSectorId();
        });


        function GetSubSubSector(subsectorID) {
            $subSubSectors = $("#<%= ddlSubSubSektor.ClientID %>"); ;
            if (subsectorID > 0) {
                var handlerUrl = '<%= ResolveUrl("~/AjaxHandler/Loaddata/getsubsubsector.ashx?method=registrasi&subsector_id=") %>';
                $.ajax({
                    type: 'POST',
                    url: handlerUrl + subsectorID,
                    contentType: 'application/json',
                    dataType: 'json',
                    success: function (datas) {
                        $subSubSectors.get(0).options.length = 0;
                        $subSubSectors.get(0).options[0] = new Option("-- Pilih Sub Sub SeKtor --", "");

                        $.each(datas, function (i, data) {
                            $subSubSectors.append('<option value="' + data.SubSubSectorID + '">' + data.SubSubSectorCode + '-' + data.SubSubSectorName + '</option>');
                        });
                    },
                    error: function () {
                        $subSubSectors.get(0).options.length = 0;
                        alert("Gagal isi Sub Sub Sector");
                    }
                });
            }
            else {
                $subSubSectors.get(0).options.length = 0;
                $subSubSectors.get(0).options[0] = new Option("-- Pilih Sub Sub Sektor --", "");
            }
            //GetTarifBySubSubSectorId();
        }

        //$("#<%= ddlSubSubSektor.ClientID %>").change(function () {

            //$('#ddlRegistrationEmisionType').combobox('autocomplete', "", "-- pilih registrasi emisi --");
            //$('#ddlJenisEmisi').combobox('autocomplete', "", "-- pilih jenis emisi --");
            //var subsubsectorid = $("#ddlSubSubSektor option:selected").val();
            //$("#<%= ddlSubSubSektor.ClientID %>").val(subsubsectorid);
            // $('#ddlRegistrationEmisionType').val('');


        //});

        $("#<%= ddlSubSektor.ClientID %>").change(function () {
            //$("#<%= ddlSektor.ClientID %>").val('-- pilih Sektor --');
            //$("#<%= ddlSubSektor.ClientID %>").val('-- pilih Sub Sektor --');
            $("#<%= ddlSubSubSektor.ClientID %>").val('-- pilih Sub Sub Sektor --');
            //$('#ddlSubSubSector').combobox('autocomplete', "", "-- pilih sub sub sektor --");
            //$('#ddlRegistrationEmisionType').combobox('autocomplete', "", "-- pilih registrasi emisi --");
            //$('#ddlJenisEmisi').combobox('autocomplete', "", "-- pilih jenis emisi --");


        });

        $("#btnNext").click(function () {
            OpenForm();
        });



        function OpenForm() {


            var periodeAwal = $("#<%= txtPeriodeAwal.ClientID %>").val();
            var periodeAkhir = $("#<%= txtPeriodeAkhir.ClientID %>").val();
            var tahun = $("#<%=txtTahun.ClientID %>>")
            var sectorID = $("#<%= ddlSektor.ClientID %>").val();
            var subsectorID = $("#<%= ddlSubSubSektor.ClientID %>").val();
            var subsubsectorID = $("#<%= ddlSubSubSektor.ClientID %>").val();
            //var balance;



            var formUrl = '<%= ResolveUrl("~/reports/rptRegristrasiViewer.aspx") %>';

            //$('#dialog1').load(formUrl + "?periodeAwal=" + periodeAwal + "&periodeAkhir=" + periodeAkhir + " tahun= " + tahun + +"&sectorID=" + sectorID + "&subsector=" + subsectorID + "&subsubsectorID=" + SubSubSectorID).dialog({ autoOpen: false, modal: true, width: 750, title: 'Laporan Regristrasi' });
            $('#dialog1').load(formUrl ).dialog({ autoOpen: false, modal: true, width: 1100, title: 'Laporan Regristrasi' });
            $("#dialog1").dialog('open');
        }


    });
    </script>

    <table border="0">
        <tr>
        
            <td style="width: 50; text-align: left; height: 17px;">
                        Periode
                    </td>
            <td style="height: 17px">
                        :
                    </td>
            <td style="height: 59px" rowspan="2">
                <asp:RadioButton ID="rbPeriode1" runat="server" GroupName="rbPeriode" />
                <asp:TextBox ID="txtPeriodeAwal" runat="server" Width="150"></asp:TextBox>
                s/d
                        <asp:TextBox ID="txtPeriodeAkhir" runat="server" Width="150"></asp:TextBox>
                <br />
                <br />
                <asp:RadioButton ID="rbTahun" runat="server" GroupName="rbPeriode" Text="Tahun" />
            &nbsp;<asp:TextBox ID="txtTahun" runat="server" input type="text" maxlength="4"> </asp:TextBox>
           
                <br />
                <br />
                <asp:RadioButton ID="rbPeriode2" runat="server" GroupName="rbPeriode" 
                    Text="Semua" Checked="True" />
            </td>
        </tr>
        <tr>
            <td style="width: 50; text-align: left; height: 59px;">
                        &nbsp;</td>
            <td style="height: 59px">
                        &nbsp;</td>
        </tr>
        <tr>
            <td style="width: 50; height: 48px;">
                Sektor
            </td>
            <td style="height: 48px">
                        :
                    </td>
            <td rowspan="2">
                <br />
                <asp:RadioButton ID="rbSektor1" runat="server" GroupName="rbSektor" />
                <asp:DropDownList ID="ddlSektor" runat="server" Width="200">
                </asp:DropDownList>
                <br />
                <br />
                <asp:RadioButton ID="rbSektor2" runat="server" GroupName="rbSektor" 
                    Text="Semua" Checked="True" />
            </td>
        </tr>
        <tr>
            <td style="width: 50">
                &nbsp;</td>
            <td>
                        &nbsp;</td>
        </tr>
        <tr>
            <td style="width: 50; height: 55px;">
                Sub Sektor</td>
            <td style="height: 55px">
                        :
                    </td>
            <td rowspan="2">
                <br />
                <asp:RadioButton ID="rbSubSektor1" runat="server" GroupName="rbSubSektor"/>
                <asp:DropDownList ID="ddlSubSektor" runat="server" Width="200">
                </asp:DropDownList>
                <br />
                <br />
                <asp:RadioButton ID="rbSubSektor2" runat="server" GroupName="rbSubSektor" 
                    Text="Semua" Checked="True" />
            </td>
        </tr>
        <tr>
            <td style="width: 50">
                &nbsp;</td>
            <td>
                        &nbsp;</td>
        </tr>
        <tr>
            <td style="width: 50; height: 54px;">
                Sub Sub Sektor 
            </td>
            <td style="height: 54px">
                       :
                    </td>
            <td rowspan="2">
                <br />
                <asp:RadioButton ID="rbSubSubSektor1" runat="server" 
                    GroupName="rbSubSubSektor"/>
                <asp:DropDownList ID="ddlSubSubSektor" runat="server" Width="200">
                </asp:DropDownList>
                <br />
                <br />
                <asp:RadioButton ID="rbSubSubSektor2" runat="server" GroupName="rbSubSubSektor" 
                    Text="Semua" Checked="True" />
            </td>
        </tr>
        <tr>
            <td style="width: 50">
                &nbsp;</td>
            <td>
                       &nbsp;</td>
        </tr>
        <tr>
            <td colspan="2">
                &nbsp;
            </td>
            <td>
                <div style="text-align: right; padding-top: 10px;">
                    <button class="dialog_link ui-state-default ui-corner-all" id="btnNext" type="button">
                        Lanjut
                    </button>
                    <button class="dialog_link ui-state-default ui-corner-all" id="btnCancel" type="button">
                        Batal
                    </button>
                </div>
            </td>
        </tr>
    </table>
    <div id="dialog1" title="Default dialog">
           </div>
</asp:Content>

